import QtQuick 2.14
import QtQuick.Controls 2.14
import QtQuick.Layouts 1.14
import QtCharts 2.3

ApplicationWindow {
    id: window
    visible: true
    width: 1024
    height: 600
    title: qsTr("Bacteria Sampler System")
    
    property var bridgeRef: qmlBridge
    property bool isLoggedIn: false
    property string currentUser: ""
    property string currentUserRole: ""

    // Main content switcher
    StackView {
        id: mainStackView
        anchors.fill: parent
        initialItem: loginPageComponent
    }
    
    // Login Page Component
    Component {
        id: loginPageComponent
        LoginPage {
            qmlBridge: window.bridgeRef
            onLoginSuccessful: {
                window.currentUser = username
                window.currentUserRole = role
                window.isLoggedIn = true
                mainStackView.replace(mainAppComponent)
            }
        }
    }
    
    // Main Application Component
    Component {
        id: mainAppComponent
        Item {
            // Navigation and Content Area
            RowLayout {
                anchors.fill: parent
                spacing: 0
        
        // Left Navigation Panel
        Rectangle {
            Layout.preferredWidth: 200
            Layout.fillHeight: true
            color: "#263238"
            
            ColumnLayout {
                anchors.fill: parent
                anchors.margins: 10
                spacing: 5
                
                // Logo/Title
                Rectangle {
                    Layout.fillWidth: true
                    Layout.preferredHeight: 60
                    color: "transparent"
                    
                    Text {
                        anchors.centerIn: parent
                        text: "Bacteria\nSampler"
                        font.pixelSize: 16
                        font.bold: true
                        color: "white"
                        horizontalAlignment: Text.AlignHCenter
                    }
                }
                
                Rectangle {
                    Layout.fillWidth: true
                    height: 1
                    color: "#37474F"
                }
                
                // Navigation Buttons
                NavigationButton {
                    Layout.fillWidth: true
                    text: "Dashboard"
                    icon: "🏠"
                    isSelected: stackView.currentItem && stackView.currentItem.objectName === "mainPage"
                    onClicked: stackView.replace(mainPageComponent)
                }
                
                NavigationButton {
                    Layout.fillWidth: true
                    text: "Task Management"
                    icon: "📋"
                    isSelected: stackView.currentItem && stackView.currentItem.objectName === "taskPage"
                    onClicked: stackView.replace(taskPageComponent)
                }
                
                NavigationButton {
                    Layout.fillWidth: true
                    text: "Data Visualization"
                    icon: "📊"
                    isSelected: stackView.currentItem && stackView.currentItem.objectName === "dataPage"
                    onClicked: stackView.replace(dataPageComponent)
                }
                
                NavigationButton {
                    Layout.fillWidth: true
                    text: "Audit Trail"
                    icon: "📝"
                    isSelected: stackView.currentItem && stackView.currentItem.objectName === "auditPage"
                    onClicked: stackView.replace(auditPageComponent)
                }
                
                NavigationButton {
                    Layout.fillWidth: true
                    text: "User Management"
                    icon: "👥"
                    isSelected: stackView.currentItem && stackView.currentItem.objectName === "userPage"
                    onClicked: stackView.replace(userPageComponent)
                }
                
                Item { Layout.fillHeight: true }
                
                Rectangle {
                    Layout.fillWidth: true
                    height: 1
                    color: "#37474F"
                }
                
                // User Info
                Rectangle {
                    Layout.fillWidth: true
                    Layout.preferredHeight: 60
                    color: "transparent"
                    
                    ColumnLayout {
                        anchors.centerIn: parent
                        spacing: 2
                        
                        Text {
                            text: userSession ? userSession.currentUser : "Unknown"
                            font.pixelSize: 12
                            font.bold: true
                            color: "white"
                            horizontalAlignment: Text.AlignHCenter
                        }
                        
                        Text {
                            text: userSession && userSession.currentRole ? userSession.currentRole : "guest"
                            font.pixelSize: 10
                            color: "#B0BEC5"
                            horizontalAlignment: Text.AlignHCenter
                        }
                    }
                }
                
                Button {
                    Layout.fillWidth: true
                    text: "Logout"
                    onClicked: {
                        // Log logout event
                        if (window.bridgeRef) {
                            console.log("Logging user logout:", window.currentUser)
                            window.bridgeRef.logUserLogout(window.currentUser)
                        }
                        
                        // Reset login state
                        window.isLoggedIn = false
                        window.currentUser = ""
                        window.currentUserRole = ""
                        
                        // Return to login page
                        mainStackView.replace(loginPageComponent)
                    }
                }
            }
        }
        
        // Main Content Area
        StackView {
            id: stackView
            Layout.fillWidth: true
            Layout.fillHeight: true
            initialItem: mainPageComponent
        }
    }
        }
    }
    
    // Page Components
    Component {
        id: mainPageComponent
        MainPage {
            objectName: "mainPage"
            qmlBridge: window.bridgeRef
        }
    }
    
    Component {
        id: taskPageComponent
        TaskManagementPage {
            objectName: "taskPage"
            qmlBridge: window.bridgeRef
        }
    }
    
    Component {
        id: dataPageComponent
        DataVisualizationPage {
            objectName: "dataPage"
            qmlBridge: window.bridgeRef
        }
    }
    
    Component {
        id: auditPageComponent
        AuditTrailPage {
            objectName: "auditPage"
            qmlBridge: window.bridgeRef
        }
    }
    
    Component {
        id: userPageComponent
        UserManagementPage {
            objectName: "userPage"
            qmlBridge: window.bridgeRef
        }
    }
}